<template>
  <div class="box">
    <router-view></router-view>
  </div>
</template>

<script setup lang="ts">
import { onMounted } from 'vue'
import { settingStore } from '@renderer/store/setStore'
import { playerInfoStore } from '@renderer/store/playerInfo'
import { playersetStore } from '@renderer/store/playerSet'
const setStoreData = settingStore()
const playerSetData = playersetStore()
const playerInfo = playerInfoStore()
let myApi
onMounted(() => {
  setStoreData.setGlobal()
  myApi = window.api
  myApi.onUpdateStorage((_, data, name) => {
    setStoreData.$state = JSON.parse(data)
    switch (name) {
      case 'setStoreData':
        setStoreData.$state = JSON.parse(data)
        break
      case 'playerInfo':
        playerInfo.$state = JSON.parse(data)
        break
      case 'playerSet':
        playerSetData.$state = JSON.parse(data)
    }
  })
})
</script>

<style scoped>
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

.box {
  background-color: var(--back);
  color: var(--text);
}
</style>